<template>
  <div class="nav">
    <div  class="back-icon" @click="back"></div>
    <h4 class="title">{{title}}</h4>
  </div>
</template>

<script>
  export default {
    name: 'NavHeader',
    props:['title'],
    methods:{
      back(){
        this.$router.back()
      }
    }
  }
</script>

<style lang="stylus" scoped>
  @import '~@/assets/main.styl'
  .nav {
    height: (1.28rem);
    border-bottom: 1px solid #b2b2b2;
    position: fixed;
    width: 100%;
    max-width:750px;
    margin-left:auto;
    margin-right:auto;
    top: 0;
    z-index: 99;
    background-color: #fff;
    .title {
      font-size: (17px);
      color: #2f2f2f;
      text-align: center;
      line-height: (1.28rem);
    }
    .back-icon {
      width: (0.38rem);
      height: (0.38rem);
      position: absolute;
      top: 0.42rem
      left: 0.3rem
      background-image: url('/app2/img/back.png');
      background-size: cover;
    }
  }
</style>
